<template>
  <view>
    <view class="one_login">
      <!-- <image class="one_login_bg" src="https://liuchongs.oss-cn-beijing.aliyuncs.com/static/8.png" mode=""></image> -->
      <image class="one_logo" :src='STATIC_URL+"19.png"' mode="aspectFill"></image>
    </view>
    <view class="login_text">
      <text>企业管理</text>
    </view>
    <view class="login_text_one">
      <text>请先授权，授权后即可使用功能</text>
    </view>
    <view v-if="xianshidata==1" class="login_btn" @click="logonFunc()">
      <text>授权</text>
    </view>
    <view v-if="xianshidata==2" class='flex flex-wrap align-center justify-center login_fd1_2'>
      <!-- <image class='login_fd1_2_c0' mode="aspectFit" :src='STATIC_URL+"3.png"'></image> -->
      <button type="default"
        style="background-color: #4177DD;color: #fff;font-size: 32rpx; width: 686rpx;border-radius: 44rpx;margin-top: 32rpx;"
        open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">获取手机号</button>
    </view>
    <!-- <view class="cance_btn" @click="cancelogin">
      <text>取消授权</text>
    </view> -->
    <view class="cance_xy">
      <image :src='STATIC_URL+"37.png"' mode="aspectFill" v-if="checked" @click="checkclick"></image>
      <image :src='STATIC_URL+"156.png"' mode="aspectFill" v-else @click="checkclick">
      </image>
      <text>已阅读并同意 <text style="color: #4177DD;" @tap.stop="handleJumpDiy" data-type="navigateTo"
          :data-url="`/pages/dlzc/agreements1713771335/agreements1713771335`">《用户注册协议》</text>与 <text
          style="color: #4177DD;" @tap.stop="handleJumpDiy" data-type="navigateTo"
          :data-url="`/pages/dlzc/privacyPolicy1713771334/privacyPolicy1713771334`">《隐私政策》</text> </text>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        xianshidata: 1, //手机授权登录的弹窗
        checked: false, //协议的选中状态
        code: "", //电话授权完获取的code
        wxinfo: {},
      }
    },
    methods: {
      //授权登录
      logonFunc() {
        let _this = this;
        if (!_this.checked) {
          _this.$message.info("请阅读协议");
          return;
        }
        uni.login({
          provider: 'weixin',
          success: (res) => {
            console.log('res', res)
            _this.code = res.code;
            let codeObj = {
              code: res.code
            }
            // let datamsg={
            //   third_type: "wx_miniapp",
            //   code: res.code,
            //   extend_info: JSON.stringify(codeObj)
            // }
            // console.log(datamsg)
            // return;
            _this.$api.post(global.apiUrls.post5d7660a421e69, {
              third_type: "wx_miniapp",
              // code: res.code,
              extend_info: JSON.stringify(codeObj)
            }).then(res1 => {
              console.log(res1)
              if (res1.data.code == '-999') {
                _this.wxinfo = res1.data.data.result;
                _this.xianshidata = 2;
              } else if (res1.data.code == 1) {
                console.log('res1res1res1res1res1', res1)
                _this.$store.commit("saveToken", res1.data.data.userinfo.user_token)
                _this.$store.commit("updateUserInfo", res1.data.data)
                _this.$message.info('登录成功')
                setTimeout(function() {
                  uni.switchTab({
                    url: '/pages/tabBar/home/home'
                  })
                }, 500)
              } else {
                _this.$message.info(res1.data.msg)
              }
            })
          }
        })
      },

      //获取手机号码登录方法
      decryptPhoneNumber(e) {
        let _this = this;
        console.log(e)
        uni.login({
          provider: 'weixin',
          success: function(res) {
            let extend_info = {
              openid: _this.wxinfo.openid,
              code: e.detail.code,
              iv: e.detail.iv,
              encrypteddata: e.detail.encryptedData
            }
            // const objsss = {
            //   third_type: "wx_miniapp",
            //   account_type: "mobile",
            //   code: res.code,
            //   openid: _this.wxinfo.openid,
            //   iv: e.detail.iv,
            //   encrypteddata: e.detail.encryptedData,
            //   extend_info: JSON.stringify(extend_info),
            // }
            // console.log('objsss', objsss.extend_info)
            // return;
            _this.$api.post(global.apiUrls.post5d7757d28d076, {
              third_type: "wx_miniapp",
              account_type: "mobile",
              // code: res.code,
              // openid: _this.wxinfo.openid,
              // iv: e.detail.iv,
              // encrypteddata: e.detail.encryptedData,
              extend_info: JSON.stringify(extend_info),
            }).then(etr => {
              if (etr.data.code == 1) {
                _this.$store.commit("saveToken", etr.data.data.userinfo.user_token)
                _this.$store.commit("updateUserInfo", etr.data.data)
                console.log('updateUserInfo', uni.getStorageSync('updateUserInfo'))
                _this.$message.info('登录成功')
                setTimeout(function() {
                  uni.switchTab({
                    url: '/pages/tabBar/home/home'
                  })
                }, 500)
              } else {
                uni.showToast({
                  title: etr.data.msg,
                  icon: 'none',
                  duration: 1500
                });
              }
            }).catch((err) => {
              console.log(err);
            });
          }
        });
      },

      //授权完绑定
      decryptPhone(e) {
        console.log("this.wxinfo", this.wxinfo)
        this.$api.post(global.apiUrls.post5d7757d28d076, {
          third_type: "wx_miniapp",
          account_type: "mobile",
          code: this.code,
          extend_info: JSON.stringify(this.wxinfo),
          iv: e.detail.iv,
          // wxinfo: this.userInfo,
        }).then(etr => {
          if (etr.data.code == 1) {
            _this.$store.commit("saveToken", etr.data.data.userinfo.user_token)
            _this.$store.commit("updateUserInfo", etr.data.data.userinfo)
          }
        }).catch((err) => {
          console.log(err);
        });
      },

      //协议选中状态
      checkclick() {
        this.checked = !this.checked;
      },

      //跳转协议
      goxieyi(type) {
        uni.navigateTo({
          url: "/pages/xieyi?type=" + type,
        })
      },

      //取消登录
      cancelogin() {
        uni.switchTab({
          url: '/pages/tabBar/home/home'
        })
        // uni.navigateBack()
      }
    }
  }
</script>

<style>
  page {
    width: 100%;
    height: 100vh;
  }

  .one_login {
    width: 750rpx;
    height: 480rpx;
    position: relative;
  }

  .one_login_bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
  }

  .one_logo {
    width: 180rpx;
    height: 180rpx;
    margin: 0 auto;
    display: block;
    position: relative;
    top: 300rpx;
    border-radius: 16rpx;
  }

  .login_text {
    width: 100%;
    overflow: hidden;
    text-align: center;
    font-size: 40rpx;
    font-weight: bold;
    color: #333333;
    line-height: 64rpx;
    margin-top: 32rpx;
  }

  .login_text_one {
    width: 100%;
    overflow: hidden;
    font-size: 24rpx;
    font-family: PingFang SC-Regular, PingFang SC;
    font-weight: 400;
    color: #999999;
    line-height: 34rpx;
    text-align: center;
    margin-top: 135rpx;
  }

  .login_btn {
    width: 638rpx;
    height: 88rpx;
    background: #0077ff;
    border-radius: 44rpx;
    font-size: 32rpx;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 88rpx;
    text-align: center;
    margin: 32rpx auto;
  }

  .cance_btn {
    font-size: 28rpx;
    font-weight: 400;
    color: #333333;
    line-height: 34rpx;
    text-align: center;
    margin: 32rpx auto;
  }

  .cance_xy {
    width: 100%;
    height: auto;
    text-align: center;
    position: fixed;
    left: 0;
    bottom: 120rpx;
  }

  .cance_xy image {
    width: 32rpx;
    height: 32rpx;
    margin-right: 10rpx;
    position: relative;
    top: 4rpx;
  }
</style>
